iT邦幫忙

2021 iThome 鐵人賽

DAY 1
0
自我挑戰組

React自我學習心得30天~系列 第 1

React學習動機&前端框架簡單介紹

  • 分享至 

  • xImage
  •  

學習動機

過去開發網頁前端程式的時候,使用基本的html、css、javascript作為開發的工具。但工作一陣子就發現這些常用了工具因為以下原因,導致它並沒有想像中來的方便。
###反覆使用重複的dom元素,讓程式看起來變得很冗長
以下以某個案子用到的按鈕為例


###承上個原因,因程式冗長導致後續維護不易
由於我們公司屬於接案型公司,隨著接手案子的增加,以及每件案子的需求差異皆互不相同,後續若收到n個月之前案子調整的話,常需要花一段時間回想到底做了些什麼,造成不必要的時間成本。

三大前端框架簡介

####Angular

Angular 是個由 Google 內部的 Angular Team 與其他社群所開發的開源專案。這個專案是同一群人由 AngularJS 所重寫的專案。該專案於2016年9月14日發行。

Angular 是基於組件、並使用指令式 HTML 樣板的框架。在構建時,框架的編譯器會將模板,轉換為優化的 JavaScript 程式。Angular 使用了 JavaScript 超集(superset)的 TypeScript。

Vue

尤雨溪在維護並理解前述的 AngularJS 專案後,於 2014 年發表了 Vue。Vue 是四大框架裡面最年輕的,但成了近年來的當紅炸子雞。

Vue 除了與 Angular 一樣,使用了一些自定義的 HTML 以外,大部分還是使用現代化的標準 JavaScript。

React

Facebook 於 2013 年發表了 React。在發表當時 Facebook 內部早已使用 React 解決許多內部問題。技術上來說 React 並不是框架,而是一個用來渲染 UI 組件的函式庫。React 通常會配合其他函式庫來建立應用程式:例如 React 搭配 React Native 建立手機程式、React 與 ReactDOM 建立網路程式...等等。

由於 React 與 ReactDOM 通常會搭在一起用,React 在通俗上會被理解為 JavaScript 框架。

這三大前端框架各有優缺點及相對的學習時間成本,之所以會使用React作為主題,最主要是因為未來工作會用到,大家也選擇自己喜歡的即可。

參考資料來源:MDN Web Docs


下一篇
Day2React安裝方式簡介
系列文
React自我學習心得30天~30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言